﻿<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>绿色评级系统登录页面（银行端）</title>
    <link rel="stylesheet" href="login.css">
</head>
<body>
    <main>
        <form class="form" action="index.html">

            <!--边框-->
            <div class="form__cover"></div>
            <div class="form__loader">
                <div class="spinner active">
                    <!--转圈-->
                    <svg class="spinner__circular" viewBox="25 25 50 50">
                        <circle class="spinner__path" cx="50" cy="50" r="20" fill="none" stroke-width="4" stroke-miterlimit="10"></circle>
                    </svg>
                </div>
            </div>

            <div class="form__content">
                <h1>绿色评级管理系统</h1>
                <div class="styled-input">
                    <input type="text" class="styled-input__input" name="nickname" id="username">
                    <div class="styled-input__placeholder">
                        <span for="username" class="styled-input__placeholder-text" >用户名</span>
                    </div>
                    <div class="styled-input__circle"></div>
                </div>
                <div class="styled-input">
                     <input type="password" class="styled-input__input" id="password">
                    <div class="styled-input__placeholder">
                        <span for="password" class="styled-input__placeholder-text">密码</span>
                    </div>
                    <div class="styled-input__circle"></div>
                </div>
                <button type="button" class="styled-button">
                    <span class="styled-button__real-text-holder">
                        <span class="styled-button__real-text">登录</span>
                        <span class="styled-button__moving-block face">
                            <span class="styled-button__text-holder">
                                <span class="styled-button__text">登录</span>
                            </span>
                        </span><span class="styled-button__moving-block back">
                            <span class="styled-button__text-holder">
                                <span class="styled-button__text">登录</span>
                            </span>
                        </span>
                    </span>
                </button>
            </div>
        </form>
    </main>

<script  src="login.js"></script>
<script src="../../qrcode/jquery2.1.4.js"></script>
<script src="../../layer/layer.js"></script>
<!--登录-->
<script>
    $(function () {
        $(".styled-button").click(function(){
            var username = $("#username").val();
            var password=$("#password").val();
            //1 先转圈
            var windowId=layer.load(0);

            //2 ajax与服务器交互
            $.post("/test/admin/login.do",{                                    // 地址
                username:username,
                password:password},
                function (data) {

                //3 关闭load窗口
                layer.close(windowId);

                //4 讲服务器返回结果进行显示
                layer.msg(data.result);
                if(data.status==0){
                    //跳转到主页
                    location.assign("index.html");
                }

            },"JSON");


        });
    });
</script>
</body>
</html>
